<nz-spin [nzSpinning]="loading" [nzDelay]="500">
  <form nz-form [formGroup]="validateForm" (ngSubmit)="submitForm()">
    <nz-form-item>
      <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="menuName">菜单名</nz-form-label>
      <nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="菜单名不能为空且长度小于20">
        <input nz-input formControlName="menuName" id="menuName"/>
      </nz-form-control>
    </nz-form-item>
    <nz-form-item>
      <nz-form-label [nzSm]="6" [nzXs]="24" [nzRequired]="!!parentId" nzFor="path">PATH</nz-form-label>
      <nz-form-control [nzSm]="14" [nzXs]="24" [nzErrorTip]="pathErrorTip">
        <input nz-input formControlName="path" id="path"/>
      </nz-form-control>
    </nz-form-item>
    <nz-form-item>
      <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="parentId">父级</nz-form-label>
      <nz-form-control [nzSm]="14" [nzXs]="24">
        <div id="parentId">{{parentName}}</div>
      </nz-form-control>
    </nz-form-item>
    <nz-form-item *ngIf="!parentId">
      <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="icon">图标</nz-form-label>
      <nz-form-control [nzSm]="14" [nzXs]="24">
        <i class="icon" nz-icon nzType="file-add" nzTheme="outline" *ngIf="!iconBase64"></i>
        <i *ngIf="iconBase64" class="icon">
          <svg xmlns="http://www.w3.org/2000/svg" width="20px" height="20px">
            <image [attr.href]="iconBase64" height="20px" width="20px"/>
          </svg>
        </i>
        <nz-upload [nzBeforeUpload]="beforeUpload">
          <button type="button" nz-button><i nz-icon nzType="upload"></i>Select File</button>
        </nz-upload>
      </nz-form-control>
    </nz-form-item>
    <nz-form-item>
      <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="remark">备注</nz-form-label>
      <nz-form-control [nzSm]="14" [nzXs]="24" [nzErrorTip]="'备注不能大于'+remarkMaxLength+'字符'">
        <nz-textarea-count [nzMaxCharacterCount]="remarkMaxLength">
          <textarea rows="4" formControlName="remark" nz-input></textarea>
        </nz-textarea-count>
      </nz-form-control>
    </nz-form-item>

    <nz-form-item nz-row class="register-area">
      <nz-form-control [nzSpan]="14" [nzOffset]="6">
        <button nz-button nzType="primary" [disabled]="!validateForm.valid || loading">保存</button>
      </nz-form-control>
    </nz-form-item>
  </form>
</nz-spin>
